<template>
  <view class="page_min_height page_pb page_bg">
    <view class="flex">
      <image class="w-full" src="/static/images/lawyer_top.png" mode="widthFix" />
    </view>
    <view class="p-12">
      <DataLoading v-if="loading" />
      <template v-else>
        <view v-if="articleList.length" class="p-12 bg-white rounded-md">
          <view class="mb-12 text-base font-bold">最新动态</view>
          <view v-for="item in articleList" :key="item.id" class="border-t border-solid border-gray-100">
            <ArticleItem :data="item" />
          </view>
        </view>
        <view v-if="dataList.length" class="mt-12 p-12 bg-white rounded-md">
          <view class="mb-12 text-base font-bold">精选律师</view>
          <view
            v-for="item in dataList"
            :key="item.id"
            class="flex justify-between py-12 border-t border-solid border-gray-100"
            @click="toDetail(item.id)"
          >
            <image :src="item.photo" mode="aspectFill" class="w-68 h-68 rounded-md" />
            <view class="flex-1 ml-12 pt-4">
              <view class="font-bold">{{ item.name }}</view>
              <view class="mt-5 text-xs text-gray-500">执业{{ item.working_years }}年</view>
              <view class="mt-5 text-xs text-gray-500 line-clamp-1">擅长：{{ item.specialty }}</view>
            </view>
          </view>
        </view>
        <EmptyData v-else />
      </template>
    </view>
  </view>
</template>

<script setup>
import { ref } from 'vue';
import { onLoad, onReachBottom } from '@dcloudio/uni-app';
import { getArticleListApi } from '@/api/article';
import { getLawyerListApi } from '@/api/lawyer';
import { usePage } from '@/utils/usePublic';
import ArticleItem from '@/components/ArticleItem.vue';

const loading = ref(true);
const pageParams = usePage({
  category_id: -1,
});

onLoad(() => {
  getArticleList();
  getDataList();
});

onReachBottom(() => {
  if (pageParams.isLoadAll) {
    return;
  }
  pageParams.page++;
});

const articleList = ref([]);
async function getArticleList() {
  const { code, data } = await getArticleListApi({ page: 1, limit: 3 });
  if (code === 200) {
    data.list.forEach(item => {
      item.contentTxt = item.content.replace(/<[^>]+>/g, '').substr(0, 30);
      item.cover = item.cover || '/static/images/default.png';
    });
    articleList.value = articleList.value.concat(data.list);
  }
}

const dataList = ref([]);
// 获取律师列表
async function getDataList() {
  try {
    const { code, data } = await getLawyerListApi(pageParams);
    loading.value = false;
    if (code === 200) {
      dataList.value = dataList.value.concat(data.list);
      pageParams.isLoadAll = data.list.length < pageParams.limit;
    }
  } catch (e) {
    loading.value = false;
    console.error(e);
  }
}
// 跳转律师详情
function toDetail(id) {
  uni.navigateTo({
    url: `/pages/lawyer/detail?id=${id}`,
  });
}
</script>
